<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>研究资源共享平台</title>
    <link rel="stylesheet" href="../layui/css/layui.css">
    <script src="../layui/layui.js"></script>
    <style>
        /*对layui中的样式进行重写*/
        .layui-tab-content {
            padding: 0;/*layui-tab-content:默认有padding: 10px;的值，因为iframe的绝对定位脱离文档流，所以会存在20px的空白空间*/
        }
        .show-frame {
            top: 50px!important;
            /*默认.layui-layout-admin .layui-body {
                top: 60px;
                bottom: 44px;
            }*/
            overflow: hidden;/*消除浏览器最右边的滚动条*/
        }
        .frame {
            position: absolute;
            padding: 10px;/*与layui-footer隔开一段距离*/
            width: 100%;
            height: 100%;
        }
    </style>
</head>
<body>
    <div class="layui-layout layui-layout-admin" >


        <div th:replace="/common/header :: headerBar"></div>
        <div th:replace="/common/lefter :: lefterBar"></div>

        <div class="layui-body show-frame">
            <div class="layui-tab layui-tab-brief" lay-allowClose="true" lay-filter="empTab">
                <ul class="layui-tab-title">
                    <li class="layui-this "><i class="layui-icon">查看个人信息</i></li>
                </ul>
                <div class="layui-tab-content">
                    <div class="layui-tab-item layui-show">
                        <table class="layui-table" lay-size="lg">
                            <colgroup>
                                <col width="150">
                                <col width="200">
                                <col>
                            </colgroup>
                            <thead>
                            <tr>
                                <th>个人信息类型</th>
                                <th>信息内容</th>
                            </tr>
                            </thead>
                            <tbody>
                            <tr>
                                <td>用户ID：</td>
                                <td>[[${session.user.userID}]]</td>
                            </tr>
                            <tr>
                                <td>用户名：</td>
                                <td>[[${session.user.userName}]]</td>
                            </tr>
                            <tr>
                                <td>密码：</td>
                                <td>[[${session.user.password}]]</td>
                            </tr>

                            <tr>
                                <td>用户类型：</td>
                                <td>[[${session.user.userType==1?"注册用户":"管理员用户"}]]</td>
                            </tr>
                            <tr>
                                <td>性别：</td>
                                <td>[[${session.user.gender}]]</td>
                            </tr>
                            <tr>
                                <td>邮箱：</td>
                                <td>[[${session.user.email}]]</td>
                            </tr>
                            <tr>
                                <td>手机号：</td>
                                <td>[[${session.user.phone}]]</td>
                            </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>



    </div>


    <div th:replace="/common/footer :: footerBar"></div>





<script src="../layui/layui.js"></script>
<script>
    //JavaScript代码区域
    layui.use('element', function(){
        var element = layui.element;
        var $ = layui.$;
        $("[name=t1]").click(function () {
            var id = $(this).attr("id");
            var content = $(this).attr("content");
            if($("li[lay-id="+id+"]").length===0){
                element.tabAdd("empTab",{
                    title:$(this).attr("title"),
                    content:"<iframe src='"+content+"' class='frame' frameborder='0'></iframe>",
                    id:id
                })
            }
            element.tabChange('empTab',id)
        })

    });
</script>
</body>
</body>
</html>
